<!--
 * createor: zc
 * email: zc8023zs@163.com
 * create_time: 2020/3/14 13:46:24
 *-->
<template>
<el-container>
	<el-main>
		<el-form ref="dataForm" :model="formData" label-width="200px" style="padding:5% 5% 0 5%">
          <el-form-item>
            <el-button type="primary" icon="el-icon-edit" @click="onSave" :loading="saveLoading">{{$t('table.save')}}</el-button>
          </el-form-item> 
          <input type="hidden" v-model="formData.class_id"/>
        <el-form-item label="seo标题：">
          <el-input v-model="formData.seo_title" placeholder="请输入seo标题"></el-input>
        </el-form-item>
        <el-form-item label="seo关键字：">
          <el-input v-model="formData.seo_key" placeholder="请输入seo关键字"></el-input>
        </el-form-item>
        <el-form-item label="seo描述：">
          <el-input type="textarea" :rows="2" v-model="formData.seo_label" placeholder="请输入seo描述"></el-input>
        </el-form-item>
          <input type="hidden" v-model="formData.version_id"/>
		</el-form>
	</el-main>
</el-container>
</template>
<style scoped>
body .app-container .el-container,
body .app-container .el-header,
body .app-container .el-main,
body .el-container,
body .el-header,
body .el-main {
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
</style>
<script>
import {
  article_class_seoSelecttree,
  article_class_seoSelectpage,
  article_class_seoSelect,
  article_class_seoAdd,
  article_class_seoUpdate,
  article_class_seoDel,
  article_class_seoInfo
} from '@/api/project/article/project_article_article_class_seo'
export default {
  name: "a_articlea_article_class_seo_edit",
  components: {  },
  data() {
    return {
      curdAction: "",
      saveLoading: false,
      formData: {
        class_id: null, 
        seo_title: null, 
        seo_key: null, 
        seo_label: null, 
        version_id: null, 
    },
    }
  },
  created(){
    var result = location.search.match(new RegExp("[\?\&]id=([^\&]+)", "i"));
    this.formData.class_id=result[1];
        this.onInfo(this.formData);
  },
  methods:{
    onSearch(){
      this.listQuery.page=1;
      this.getList();
    },
    onInfoPage(scope){
      var view = this.$store.state.permission.routesMap["/article/article_class_seo_info"];
      this.$router.push({ path: view.path, query: {m_id:view.code_aes,id:scope.row.class_id} })
    }, 
    reset(){
      this.formData = {
        class_id: null, 
        seo_title: null, 
        seo_key: null, 
        seo_label: null, 
        version_id: null, 
      };
 
    },
    onSave(){
      this.$refs["dataForm"].validate(valid => {
        if (valid) {
          this.saveLoading = true;
          if (this.curdAction == "add") {
            article_class_seoAdd(this.$qs.stringify(this.formData)).then(r => {
                this.formData.class_id=r.dataSingle;
                this.curdAction = 'update';
                this.saveLoading  = false;
                this.$notify({
                  title: "添加成功",
                  type: "success",
                  duration: 2000
                });
                var that = this;
                setTimeout(function(){ 
                  that.closeSelectedTag();
                },2000);
            }).catch(()=>{
              this.saveLoading=false;
            });
          } else if (this.curdAction == "update") {
            article_class_seoUpdate(this.$qs.stringify(this.formData)).then(r => {
                this.saveLoading  = false;
                this.$notify({
                  title: "修改成功",
                  type: "success",
                  duration: 2000
                });
                var that = this;
                setTimeout(function(){ 
                  that.closeSelectedTag();
                },2000);
            }).catch(()=>{
              this.saveLoading=false;
            });
          }
        }
      });
    },
    onInfo(data){
        article_class_seoInfo({id:data.class_id}).then(r=>{
          if(r.dataSingle==null){
            this.curdAction = "add";
            return false;
          }
            this.formData.class_id=r.dataSingle.class_id;
            this.formData.seo_title=r.dataSingle.seo_title;
            this.formData.seo_key=r.dataSingle.seo_key;
            this.formData.seo_label=r.dataSingle.seo_label;
            this.formData.version_id=r.dataSingle.version_id;
            this.curdAction = "update";
        });
    },
    closeSelectedTag() {
      var view = this.$store.state.permission.routesMap["/article/article_class_seo_edit"];
      this.$store.dispatch('tagsView/delView', view).then(({ visitedViews }) => {
        if (this.isActive(view)) {
          this.toLastView(visitedViews, view)
        }
      })
    },
    toLastView(visitedViews, view) {
      const latestView = visitedViews.slice(-1)[0]
      if (latestView) {
        this.$router.push(latestView.fullPath)
      } else {
        if (view.name === 'Dashboard') {
          this.$router.replace({ path: '/redirect' + view.fullPath })
        } else {
          this.$router.push('/')
        }
      }
    },
    isActive(route) {
      return route.path === this.$route.path
    },
  }
}
</script>